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从 中 国 新 闻 奖 获奖 作品 看 H5 制作 趋势 与 技巧 


摘 要 : 近年 来 ， 在 中 国 新 闻 奖 的 媒体 融合 获奖 作品 中 ， 不 乏 精 彩 的 H5 作品 。 当 H5 广泛 应 用 于 新 闻 媒 体 领 域 ， 如 何 制 作 
优质 的 融 媒 体 产 品 ， 本 文 以 22 部 独立 的 H5 作品 为 样本 ， 分 析 H5 作品 制作 的 趋势 与 技巧 。 
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文 / 贾 卑 


2018 年 ， 第 28 届 中 国 新 闻 奖 首次 设立 媒体 融合 奖 ， 
下 设 六 个 奖项 : 融 媒 短视 频 、 融 媒 直播 、 融 媒 互 动 、 融 
媒 界面 、 融 媒 栏目 、 融 媒 创新 。 在 第 29 届 中 国 新 闻 奖 中 ， 
将 与 媒体 融合 相关 的 奖项 名 称 进 行 了 调整 ， 改 为 短视 频 
新 闻 、 移 动 直 播 、 新 媒体 创意 互动 、 新 媒体 报道 界面 、 
新 媒体 品牌 栏目 、 融 合 创新 。 

在 两 届 中 国 新 闻 奖 的 获奖 作品 中 , 均 有 11 部 HS 作 
品 获 得 媒体 融合 奖 。HS5 是 获奖 作品 的 主要 形式 之 一 ， 因 
此 从 中 国 新 闻 奖 的 获奖 作品 中 分 析 HS 制作 的 规律 ， 对 
H5 新 媒体 内 容 生 产 具有 实践 意义 。 
1. 从 获奖 作品 看 H5 制作 趋势 
1.1 用 户 参与 内 容 创 作 ， 促 进 传播 与 爆 款 形成 

在 中 国 新 闻 奖 中 ， 人 民 日 报 的 《军装 照 》、 央 视 财 
经 的 《幸福 照相 馆 》 分 别 获得 两 届 新 闻 奖 的 一 等 奖 。 这 
种 鼓励 用 户 用 简单 的 交互 参与 H5 内 容 创 作 的 方式 ， 让 用 
户 更 加 有 展示 和 分 享 欲望 , 从 而 促进 传播 与 爆 款 的 形成 。 
目前 ， 人 脸 AI 合成 是 比较 受 欢迎 的 形式 ,但 对 接 、 调 试 
接口 投入 成 本 较 高 ， 另 外 还 有 其 他 的 互动 形式 ， 但 相对 
人 脸 AI 合成 的 形式 ， 明 显 缺 乏 趣味 性 。 
奖项 题目 发 布 账号 


“军装 照 ”H5 人 民 日 报 阁 户 端 
一 等 奖 “ 央 广 主播 的 朋友 图” 系列 H5 报 道 


作品 选 题 类 别 主要 交互 功能 
节日/ 军事 ”人 脸 识别 AI 合 成 、 长 按 保存 图 片 


“中 国之 声 ” 微 信 公 号 。 政治 /两 会 /民生 ”按钮 、 短 视频 


长 幅 百 动 连环 画 | 天 渠 : 间 义 老 村 支书 黄 可 
大 发 36 年 引水 修 泄 记 率 源 新闻 新 闻 人 物 。 ”长 页 面 、VR 

你 收 到 的 是 1927 年 8 月 1 日 发 来 的 包 误 中 国 至 网 节日 /军事 ”人 快 内 、 短 视频 

最 言 妙 的 一 日 游 夺 闪闪 进 的 新 江 可 若 新 华 社 宕 户 诺 民生 长 短 页 面 结合 、 短 视频 、 按 钮 与 弹出 内 容 


二 等 奖 ”春风 春雨 度 关东 辽宁 日 报 新 闻 客 户 端 两 会 /民生 关键 着 动画 、 按 钮 与 弹出 内 容 
人 沙场 解放 至 报 客户 湛 方 日 /至 地 短视 频 
听 ， 长 江 说 ! 长 江 云 两 会 /民生 音频 、 浪 钮 与 弹出 内 容 
国家 公祭 日 新 媒体 互动 H5 项 目 江苏 交通 广播 网 官方 微 信 政治 表单 、 计 数 器 
三 等 奖 
他 在 北京 于 两 会 却 “ 星 ” 爆 了 新 疆 朋 互 图 ! 先锋 961 政治 /两 会 /民生 ”按钮 、 短 视频 
我 为 港 珠 澳 大 桥 完成 了 “深海 穿 针 ” 珠海 日 报 APP 新 闻 现 场 拖 搜 、 长 按 、 位 置 判 断 
HE 串 性 \ 口 _ IE 
第 二 十 八 届 获奖 作品 情况 一 览 
奖项 是 目 刊 播 单位 /发 布 账号 。。 作品 选 旺 类 别 交互 功能 
幸福 照相 馆 央视 财经 客户 诺 民生 人 险 AI 合成 、 长 按 保存 图 片 
一 等 奖 。。 H5| 改 革 开 放 40 年 .长 沙 有 多 “长 ” 时 刻 新 闻 客户 详 政治 /民生 ”长 页 面 、 计 数 器 、 按 钮 、 动 画 
海拔 四 千 米 之 上 裳 涯 新 闻 客 户 庙 新 闻 现场 。 短视 频 、 虚 拟 现实 、 按 钮 与 弹出 内 容 
二 等 奖 。” 苗 春 “十 八 ” 变 新 湖南 客户 着 民生 /扶贫 。” 短视 频 、 按 钮 


超级 H5 | 快 来 ! 搭乘 “海南 号 ”时 空 穿梭 本 
机 重 返 19881! 海南 日 报 客户 端 政治 长 页 面 、 计 数 器 、 拖 搜 按钮 与 强 出 内 容 


西藏 日 报 激 信 公 号 民生 动画 、 按 钮 
动画 、 音 频 、 短 视频 、 弹 莫 、 长 按 保存 图 片 


H5 | 我 看 到 了 幸福 的 模样 ! 西藏 家 庭 私 茂 
照 首发 


他 的 日 记 为 路 被 国家 博物 馆 收藏 
三 等 光 。 我 多 合家 国 因 他 们 为 国 守 边 元 为 生命 。 兵 加 日 报 微 信 公众 号 。 至 事 /新 闻 人 物 “动画 


特别 策划 | 点 击 “ 浙 ” 字 跳 起 来 看 浙江 40 
不 凡 之 路 


浇 北 日 报 客户 端 新 闻 任 务 


浙江 新 闻 客户 端 政治 /民生 ”长 按 、 动画、 长 页 面 


跨越 40 年 ，2019 的 车 开 过 来 了 
大 型 互动 手绘 长 卷 | 傅 . 淮 : 淮河 庄 台 40 年 
简 史 


闪电 新 闻 客户 庙 政治 /民生 长 按 、 动 画 、 长 页 面 


中 安 新 闻 客 户 庙 民生 /扶贫 。 长 页 面 


第 二 十 九 届 获 奖 作品 情况 一 览 


如 果 这 一 类 让 用 户 参 与 其 中 的 H5 作品 ， 结 合 重大 节 
日 或 事件 进行 策划 和 推送 ， 会 让 用 户 产生 更 多 共鸣 ， 也 
会 进一步 促成 爆 款 的 形成 。 例 如 ， 今 年 国庆 期 间 ， 腾 讯 
新 闻 极 速 版 出 品 的 换 国 旗 头 像 的 H5， 就 属于 这 一 类 作品 。 
1. 2 短视 频 与 H5 结合 ， 改 变 叙 事 方式 

由 于 H5 可 以 包含 除 短 视频 以 外 更 多 的 内 容 与 交互 
元 素 ， 因 此 媒体 趋向 于 将 短视 频 加 入 HS 作品 中 ， 使 新 闻 
作品 从 短视 频 的 单一 线性 叙事 向 非 线性 叙事 方式 转变 ， 
同时 形成 更 广泛 的 传播 。 例如， 中 国 军 网 的 获奖 作品 《你 
收 到 的 是 1927 年 8 月 1 日 发 来 的 包 庄 》 使 用 了 快 闪 的 短 
视频 风格 ， 而 新 湖南 的 《 苗 寨 “十 八 ” 变 》 将 一 则 短视 
频 作为 HS 作品 的 开篇 ， 引 出 后 续 的 人 物 采访 短视 频 。 

在 短视 频 融 合 到 H5 作品 的 过 程 中 ， 需 要 注意 的 是 ， 
HS 中 的 短视 频 内 容 需 要 尽量 保持 短小 精 悍 ， 过 长 的 内 容 
会 导致 HS 作品 加 载 过 慢 ， 或 用 户 观看 过 程 中 感到 枯燥 而 
跳出 页 面 。 
短视 频 与 H5 结 合 ， 改 变 叙事 方式 


中 国 军 网 : 
A 口 | ke a 你 收 到 的 是 1927 年 8 
全 所 的 年 来 自 4 
1927 年 8 月 1 号 月 1 日 发 来 的 包 囊 
发 来 的 包裹 TF ( 快 闪 ) 
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1. 3 按钮 与 动画 最 常用 ， 交 互 设计 是 关键 

按钮 与 动画 依然 是 H5 作品 中 最 常用 的 形式 ， 这 两 种 
互动 在 制作 方面 非常 简单 , 也 可 以 搭配 形成 丰富 的 效果 。 
目前 比较 流行 的 按钮 与 动画 结合 的 互动 形式 主要 有 幻灯 
片 、 融 媒体 、 测 试题 和 小 游戏 四 种 ， 这 些 互 动 形式 在 新 
闻 奖 的 获奖 作品 中 也 有 所 体现 。 

例如 《 听 ， 长 江 说 ! 》 这 样 简单 的 H5 测试 题 、《 我 
为 港 珠 澳 大 桥 完成 了 “深海 穿 针 ”》 的 H5 小 游戏 ， 都 是 
可 以 促进 用 户 使 用 和 参与 的 互动 形式 ， 但 需要 根据 新 闻 
内 容 选择 合适 的 形式 和 交互 ， 并 给 予 相 关 的 操作 提示 。 
按钮 与 动画 最 常用 ， 交 互 设 计 是 关键 
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听 , 长 江 说 ! 长 江 云 


听 ， 长 江 说 ! 


( 测试 题 ) 


关键 
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按钮 与 动画 最 常用 ， 交 互 设 计 


珠海 日 报 : 
我 为 港 珠 澳 大 桥 完成 
了 “深海 穿 针 ” 

( 小 游戏 ) 


按钮 与 动画 搭配 ， 虽 然 可 以 实现 丰富 的 互动 效果 ， 
但 在 用 户 交 互 路 径 和 交互 设计 方面 ， 还 是 应 避免 H5 页 面 
的 交互 过 度 繁杂 ， 导 致 用 户 在 操作 时 无 所 适 从 。 
1.4 长 页 面 依 然 流 行 ， 内 含 多 元 互动 

长 页 面 依然 为 非常 流行 的 H5 互动 形式 之 一 ， 并 且 可 
以 搭配 按钮 、 动 画 、 音 视频 等 多 元 互动 元 素 ， 除 了 纵向 
长 页 面 的 常规 设计 之 外 ， 横 向 长 页 面 的 使 用 也 呈现 增长 
趋势 ， 如 获奖 作品 《 快 来 ! 搭乘 “海南 号 ”时 空 穿 梭 机 
重 返 1988! 灌 用 的 是 纵向 长 页 面 的 形式 ,而 获奖 作品 改 
革 开 放 40 年 长沙 有 多 “长 ”》 和 采用 的 是 横向 长 页 面 的 


从 目前 的 制作 情况 来 看 ， 长 页 面 的 H5 作品 制作 主要 
取决 于 平面 设计 与 交互 设计 是 否 精彩 。 如 果 设 计较 为 平 
庸 ， 用 户 可 能 会 认为 内 容 和 交互 过 于 无 趣 ， 单 向 滑动 切 
换 场 景 的 操作 方式 过 于 单一 ， 在 观看 过 程 中 ， 用 户 可 能 
会 失去 耐心 从 而 跳出 页 面 。 
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长 页 面 依然 为 流行 ， 内 含 多 元 互动 
时 刻 新 闻 : 改革 开放 40 年 :长沙 有 多 “长 ” 
( 横向 长 页 面 ) 


快 来 ! 搭乘 “海南 
1 图 当时 空 字 术 机 重 
oP 返 19881! 
( 纵向 长 页 面 ) 


a 0 [m] eee 
1.5 虚拟 现实 VR、 增强 现实 AR 或 成 为 H5 新 方向 ， 制 作 
成 本 较 高 

5G 时 代 的 到 来 、 网 络 环境 与 速度 的 改善 会 使 虚拟 现 
实 VR 与 增强 现实 AR 成 为 H5 内 容 生产 的 新 方向 。 相 比 
于 其 他 HS 中 的 素材 和 互动 形式 ， 虚 拟 现实 VR 与 增强 现 
实 AR 制作 成 本 较 高 ， 需 要 其 他 设备 采集 相关 的 素材 和 
内 容 ， 如 滚 涯 新 闻 的 获奖 作品 《海拔 四 千 米 以 上 》, 无 
论 是 在 内 容 采 集 方面 还 是 H5 制作 方面 ， 都 可 见 其 投入 的 
成 本 与 精力 。 而 增强 现实 AR 当前 的 应 用 主要 局 限于 游 
戏 和 电影 领域 ， 在 新 闻 行 业 的 应 用 场景 依然 需要 探索 。 
2. 从 获奖 作品 看 H5 作品 制作 技巧 
2. 1 融 媒体 内 容 与 交互 路 径 、 交 互 元 素 相 匹配 

在 制作 一 个 HS 作品 时 ， 需 要 根据 融 媒体 素材 与 内 容 
确定 与 之 相 匹配 的 交互 路 径 、 交 互 元 素 , 确保 内 容 、 互 动 、 
设计 风格 的 一 致 性 。 在 交互 界面 和 路 径 设计 方面 ， 应 保证 
叙事 方式 .内 容 线索 、 交 互 路 径 相 互 匹配 。 另 外 , 在 必要 时 ， 
也 需要 设计 一 些 操作 提示 , 引导 用 户 操作 和 观看 HS 作品 。 
2. 2 用 户 思维 的 功能 设计 

H5 作品 如 何 成 为 爆 款 ?不 可 或 缺 的 一 点 是 站 在 用 户 
的 立场 上 思考 ， 进 行 作品 的 功能 设计 。 

HS 用 户 使 用 和 传播 的 逻辑 在 于 用 简单 的 投入 获得 丰 
富 的 产 出 。 简 单 投入 即 降低 用 户 的 参与 成 本 ， 包 括 使 用 
H5 的 时 间 成 本 、 探 索 交 互 的 思考 成 本 等 ; 丰富 产 出 即 提 
供给 用 户 预 期 收益 , 即 用 户 可 以 通过 分 享 H5 来 展示 自我 、 
塑造 形象 的 “社会 货币 ”的 利益 ， 或 者 得 到 现金 或 实际 
利益 。 用 户 思维 的 功能 设计 ， 是 用 户 接受 、 喜 爱 从 而 传 
播 HS 作品 的 关键 技巧 。 
2. 3 理 清 思路 ， 从 0 到 1 打造 H5 作品 

在 策划 和 制作 HS 作品 时 ， 多 数 制作 者 的 常用 方式 是 
采用 头脑 风暴 或 模仿 的 方式 ， 边 制作 边 构 思 ， 这 样 可 能 
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会 导致 H5 作品 发 布 后 达 不 到 预期 的 效果 或 传播 目的 。 因 
此 在 这 里 ， 我 们 介绍 一 种 从 0 到 1 打造 H5 作品 的 思路 ， 
可 以 将 其 运用 到 实际 的 HS 内 容 策划 与 制作 中 。 


策划 技巧 三 : 理 清 思路 ， 从 0 到 1 打造 H5 作 品 


定位 需求 分 析 
产品 定位 用 户 需求 产品 功能 UI 设计 如 何 运营 
用 户 定位 功能 需求 产品 体验 
调 性 定位 互动 需求 


方正 飞翔 数字 版 由 H5 制作 工具 与 云端 的 配套 服务 两 
部 分 组 成 ， 适 用 于 传媒 出 版 单位 的 编辑 、 美 编 、 新 媒体 


方正 飞翔 数字 版 H5 功 能 介绍 


加 H5 制 作 工具 : 方正 飞翔 数字 版 除 H5 作 品 基 本 的 音 视 
频 、 动 画 交 互 功 能 外 ， 还 提供 按钮 、 图 像 扫 视 、 图 
像 对 比 、 数 据 收集 与 分 享 、 虚 拟 现实 ( VR ) 、 增 强 
现实 ( AR ) 等 功能 。 


加 H5 云 端 配套 服务 : 与 方正 飞翔 数字 版 功能 无 颖 衔接 ， 
为 用 户 的 H5 作 品 提供 云端 预览 、 管 理 、 发 布 的 一 体 
化 中 心 ， 以 及 一 系列 增值 及 个 性 化 服务 。 

加 适用 用 户 ; 传媒 出 版 单位 的 编辑 、 美 编 、 新 媒体 策 
划 及 运营 人 员 


目前 ,方正 飞翔 数字 版 针对 传媒 出 版 机 构 用 户 ， 持 
续 进 行 新 闻 类 H5 作品 活动 ， 包 括 但 不 限于 以 下 内 容 : 
1. 产品 试用 : 针对 传媒 出 版 机 构 ， 进 行 免费 方正 飞翔 数 
字 版 的 试用 。2.H5 新 闻 案 例 合 作 : 对 传媒 出 版 机 构 的 H5 
制作 提供 技术 支持 。3.H5 新 闻 作 品 策划 与 制作 培训 : 对 
传媒 出 版 机 构 的 H5 策划 制作 的 提供 集中 培训 。 
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